﻿
@{
    ViewBag.Title = "FriendsIndex";
    Layout = "~/Views/SharedHead/Top-Header.cshtml";
}
@section Styles{
    <link rel="stylesheet" href="~/css/TY-Header.css">
    <link href="~/css/Friends.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/iconfont/iconfont.css">
    <script src="~/js/jquery-3.6.4.min.js"></script>
}
@section Scripts{
    <script src="~/js/BeijingBianhua.js"></script>
    <script src="~/js/Top-frame.js"></script>
    <Script src="~/js/Square.js"></Script>
    <script src="~/js/PingLunQu.js"></script>
}

<script type="text/javascript">
    //页面启动时触发
    $.ajaxSetup({ async: false });
    $(document).ready(function () {
        houyouxianshi();
    })

    //显示好友列表
    //显示好友列表
    function houyouxianshi() {
        var id = $("#DengLuid").text();
        $.ajax({
            //请求方式
            type: 'post',
            //发送请求的地址
            url: '/Home/XianShiHouYou',
            //服务器返回的数据类型
            datatype: 'json',
            //发送到服务器的数据，对象必须为key/value的格式，jquery会自动转换为字符串格式
            data: { "id": id },
            success: function (data) {
                //请求成功函数内容
                console.log(data);
                var group = $.parseJSON(data);
                //拼接字符串
                var str = '';
                var bd = "'";
                //对数据做遍历，拼接到页面显示
                for (var i = 0; i < group.length; i++) {
                    str +=
                        '<li>' +
                        '<div id="LieBiao-haoyou">' +
                        '<img id="LieBiao-haoyou-touxiang" src="/TouXiang/' + group[i].img + '" alt="" />' +
                        '<span id="HaoYouName">' + group[i].name + '</span>' +
                        '<button id="HaoYouBtn" onclick="window.location.href =' + bd + '/Home/FriendsIndex/?WBID=' + group[i].WBID + bd + '"type="button"><i class="iconfont icon-yonghu"></i></button>' +
                        '</div>' +
                        '</li>';
                }
                //放入页面的容器显示
                $('#ZYHouYou').html(str);
            },
            error: function (jqxhr) {
                //请求失败函数内容
            }
        });
    }

    //显示评论列表
    function PingLun(id) {
        //console.log(id);
        $.ajax({
            //请求方式
            type: 'post',
            //发送请求的地址
            url: '/Home/PLSelect',
            //服务器返回的数据类型
            datatype: 'json',
            //发送到服务器的数据，对象必须为key/value的格式，jquery会自动转换为字符串格式
            data: { "id": id },
            success: function (data) {
                //请求成功函数内容
                console.log(data);
                var group = $.parseJSON(data);
                //拼接字符串
                var str = '';
                //对数据做遍历，拼接到页面显示
                for (var i = 0; i < group.length; i++) {
                    str +=
                        '<li>' +
                        '<span>' + group[i].name + '&nbsp;:</span><span>' + group[i].plnr + '</span>' +
                        '</li>';
                }
                //放入页面的容器显示
                $('#xianshipl_' + id).html(str);
            },
            error: function (jqxhr) {
                //请求失败函数内容
            }
        });
    }


    //增加评论
    function AddPL(pid) {
        var addtxt = $('#zengjiapl_' + pid).val();
        console.log(addtxt);
        $.ajax({
            //请求方式
            type: 'post',
            //发送请求的地址
            url: '/Home/ADDPL',
            //服务器返回的数据类型
            datatype: 'json',
            //发送到服务器的数据，对象必须为key/value的格式，jquery会自动转换为字符串格式
            data: { "PID": pid, "addtxt": addtxt },
            success: function (data) {
                if (data == true) {
                    alert("增加成功");
                } else {
                    alert("增加失败");
                }
            },
            error: function (jqxhr) {
                //请求失败函数内容
                alert("增加失败");
            }
        });
    }
</script>

<div class="Content">
    <div class="Weizhi">
        <div class="Content-left">
            <div class="Content-left-top">
                <div class="touxiang">
                    <img src="~/TouXiang/@ViewBag.GRImg" alt="">
                    <h3>@ViewBag.GRName</h3>
                    <span>@ViewBag.GRJianJie</span>
                </div>
                <div class="shuju">
                    <div id="guanzhu">
                        <h4>@ViewBag.FenSi</h4>
                        <span>关注</span>
                    </div>
                    <div id="dongtai">
                        <h4>@ViewBag.Weibo</h4>
                        <span>动态</span>
                    </div>
                </div>
                <div class="grxinxi">
                    <input type="button" onclick='location.href=("/Home/SquareIndex")' value="返回主页">
                </div>
            </div>
        </div>
        <div class="Content-centen">
            <!-- ------------------------------------------------------------------------ -->
            @foreach (var item in ViewBag.homelist)
            {
                <div class="centen-xianshi">
                    <div class="centen-xianshi-dingwei">
                        <div id="xianshi-img">
                            <img src="~/TouXiang/@item.img" alt="">
                        </div>
                        <div id="xinxi">
                            <h4>@item.name</h4>
                            <span>@item.jianjie</span>
                        </div>
                    </div>
                    <div class="neirong">
                        <p>@item.wenben</p>
                        @if (@item.tupian != null)
                        {
                            <img src="~/TuPian/@item.tupian" alt="Alternate Text" style="width:650px;height:auto;" />
                        }
                        @if (@item.shipian != null)
                        {
                            <video class="shipian1" controls="controls" style="width:650px;height:auto;">
                                <source src="~/shipian/@item.shipian" type="video/mp4" />
                            </video>
                        }
                    </div>
                    <div class="pinglun">
                        <button id="aixin"><i class="iconfont icon-aixin"></i>@item.xihuan</button>
                        <button class="check-box" id="pinglun"><i class="iconfont icon-pinglun"></i>评论人數</button>
                        <button id="zhuanfa"><i class="iconfont icon-zhuanfa"></i>@item.zhuanfa</button>
                        <button type="button" value="@item.PID" onclick="PingLun(this.value)"><i class="iconfont icon-shuaxin"></i>刷新</button>
                    </div>
                    <div class="pinglunqu">
                        <div id="shurupl">
                            <input type="text" name="TjPl" id="zengjiapl_@item.PID" placeholder="输入评论..." required>
                            <button type="button" value="@item.PID" onclick=" AddPL(this.value)">评论</button>
                        </div>
                        <div id="xianshipl">
                            <ul id="xianshipl_@item.PID">
                            </ul>
                        </div>
                    </div>
                </div>
            }
        </div>
        <div class="Right-HouYou">
            <div class="Right-HouYou-top">
                <div id="HouYou-ShuaXin">
                    <span>好友</span>
                    <span id="DengLuid" style="display:none;">@ViewBag.WBID</span>
                    <button id="HYshuaXin"><i class="iconfont icon-shuaxin"></i></button>
                </div>
                <div id="HouYou-LieBiao">
                    <ul id="ZYHouYou">
                    </ul>
                </div>
            </div>
        </div>

    </div>
</div>
